<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="../../plugins/layui/css/layui.css"/>
    <link rel="stylesheet" href="../../css/normalize.css"/>
    <link rel="stylesheet" href="../../css/fa.css"/>
    <link rel="stylesheet" href="../../css/icon.css"/>
    <link rel="stylesheet" href="../../css/ares_animate.min.css"/>
    <link rel="stylesheet" href="../../css/ares_hover_variant.min.css"/>
    <link rel="stylesheet" href="../../css/ares_reboot.css"/>
    <link rel="stylesheet" href="../../css/app.min.css"/>
    <link rel="stylesheet" href="../../css/iframe.css"/>
    <style>
        form {
            background-color: #f1f1f1;
            border-radius: 2px;
            padding-top: 20px;
            padding-bottom: 5px;
        }
    </style>
</head>
<body>
<h3>基本信息</h3>
<div class="ares-mb emr-info"></div>
<hr>
<form class="ares-mb-lg layui-form" lay-filter="form">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">疾病种类</label>
            <div class="layui-input-inline">
                <select id="disease" name="disease" lay-verify="required" lay-filter="disease"></select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">评估量表</label>
            <div class="layui-input-inline">
                <select id="gauge" name="gauge" lay-verify="required" lay-filter="gauge"></select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">治疗人员</label>
            <div class="layui-input-inline">
                <select id="therapist" name="therapist" lay-verify="required" lay-filter="therapist"></select>
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">注意事项</label>
            <div class="layui-input-inline">
                <input name="prescribed" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <button class="layui-btn" lay-submit lay-filter="submit">添加</button>
        </div>
    </div>
</form>
<table class="layui-hide" id="table" lay-filter="table"></table>

<button id="create-prcp" class="layui-btn layui-hide">新建评估处方</button>

<script type="text/html" id="tableBar">
    <button class="layui-btn layui-btn-xs layui-btn-danger" lay-event="remove" data-idx="{{d.LAY_TABLE_INDEX}}">删除</button>
</script>
<script type="text/javascript" src="../../plugins/layui/layui.js"></script>
<script type="text/javascript" src="../../aresExtends/config/layuiConfig.js"></script>
<script>
    layui.use(['table', 'form', 'mandyServices', 'commonServices', 'utils', 'store', 'qs', '_'], function (table, form, mandyServices, commonServices, utils, store, qs, _) {
        var localHash = location.hash,
            queryStr = localHash.split('?')[1],
            routerParams = top.layui.routers.params,
            routerQuery = queryStr ? qs.parse(queryStr) : {},
            emrId = routerParams.emrId,
            curHospitalId = store.session.get('hospital'),
            curDivisionId = store.session.get('division'),
            diseaseList = [],
            gaugeList = [],
            therapistList = [],
            listExtend = [],
            $createPrcp = $('#create-prcp');
        console.log(localHash, queryStr, routerParams, routerQuery)

        init();

        /**
         * @author: ares
         * @date: 2021/3/9 9:52
         * @description: 提交表单
         */
        form.on('submit(submit)', function (data) {
            var fields = data.field;
            listExtend.push({
                disease: getExtendData(fields.disease, diseaseList),
                gauge: getExtendData(fields.gauge, gaugeList),
                therapist: getExtendData(fields.therapist, therapistList, true),
                prescribed: fields.prescribed
            });
            refreshPrcpTable();
            return false;
        });

        /**
         * @author: ares
         * @date: 2021/3/11 22:26
         * @description: 切换病种
         */
        form.on('select(disease)', function (data) {
            getGauge(data.value);
        });

        /**
         * @author: ares
         * @date: 2021/3/11 22:26
         * @description: 新建康复评估
         */
        $createPrcp.on('click', function () {
            var list = [],
                $this = $(this);
            $.each(listExtend, function (idx, item) {
                list.push({
                    current_therapist: {id: item.therapist.profile_info.id},
                    medical: {id: item.therapist.profile_info.id},
                    therapist: {id: item.therapist.profile_info.id},
                    disease: {id: item.disease.id},
                    gauge: {id: item.gauge.id},
                    prescribed: item.prescribed
                })
            })
            $this.prop('disabled', true).addClass('layui-btn-disabled');
            console.log(list)
            mandyServices.mandy_add_prescription(1, null, null, null, emrId, list).then(function (res) {
                utils.confirm('是否继续添加评估处方?', {icon: 3, title: '添加成功'}, function (index) {
                    location.reload();
                    utils.layer.close(index);
                }, function (index) {
                    utils.layer.close(index);
                    utils.closeCurrentSysTab();
                });
                $this.prop('disabled', false).removeClass('layui-btn-disabled');
            }).catch(function (err) {
                $this.prop('disabled', false).removeClass('layui-btn-disabled')
            })
        })

        /**
         * @author: ares
         * @date: 2021/3/11 20:37
         * @description: 获取病种
         */
        function getDisease() {
            mandyServices.mandy_get_disease_list().then(function (res) {
                var data = res.data,
                    $disease = $('#disease'),
                    $fragment = $(document.createDocumentFragment());
                diseaseList = data.disease_list;
                $fragment.append('<option value="">请选择病种</option>')
                $.each(data.disease_list, function (idx, item) {
                    $fragment.append('<option value="' + item.id + '">' + item.name + '</option>')
                });
                $disease.empty().append($fragment);
                form.render('select');
                if (data.disease_list.length) {
                    form.val('form', {
                        disease: data.disease_list[0].id
                    })
                    getGauge(data.disease_list[0].id);
                }
            });
        }

        /**
         * @author: ares
         * @date: 2021/3/11 20:56
         * @description: 根据病种获取评估量表
         * @param{string} diseaseId  病种id
         */
        function getGauge(diseaseId) {
            mandyServices.mandy_get_gauge_list(diseaseId).then(function (res) {
                var data = res.data,
                    $gauge = $('#gauge'),
                    $fragment = $(document.createDocumentFragment());
                gaugeList = data.gauge_list;
                $fragment.append('<option value="">请选择评估量表</option>')
                $.each(data.gauge_list, function (idx, item) {
                    $fragment.append('<option value="' + item.id + '">' + item.name + '</option>')
                });
                $gauge.empty().append($fragment);
                form.render('select');
                if (data.gauge_list.length) {
                    form.val('form', {
                        gauge: data.gauge_list[0].id
                    })
                }
            });
        }

        /**
         * @author: ares
         * @date: 2021/3/11 20:59
         * @description: 获取治疗师
         */
        function getTherapist() {
            mandyServices.mandy_get_medical_staff_list(null, curHospitalId, curDivisionId, null, null, null, null, null, null).then(function (res) {
                var data = res.data,
                    $therapist = $('#therapist'),
                    $fragment = $(document.createDocumentFragment());
                therapistList = data.medical_staff;
                $fragment.append('<option value="">请选择治疗人员</option>')
                $.each(data.medical_staff, function (idx, item) {
                    var profile = (item.profile_info.job == 'doctor' ? 'Y ' : 'Z ') + item.profile_info.name;
                    $fragment.append('<option value="' + item.profile_info.id + '">' + profile + '</option>')
                });
                $therapist.empty().append($fragment);
                form.render('select');
                if (data.medical_staff.length) {
                    form.val('form', {
                        therapist: data.medical_staff[0].profile_info.id
                    })
                }
            });
        }

        /**
         * @author: ares
         * @date: 2021/3/11 21:21
         * @description: 过滤病种\量表\治疗师
         * @param{string} typeId   病种id|量表id|治疗师id
         * @param{array} typeArray   病种列表|量表列表|治疗师列表
         * @param{boolean} isTherapist   是否是治疗师
         */
        function getExtendData(typeId, typeArray, isTherapist) {
            var filterData = _.filter(typeArray, function (item) {
                if (isTherapist) {
                    return item.profile_info.id == typeId;
                } else {
                    return item.id == typeId;
                }
            });
            if (filterData.length) return filterData[0];
            return {};
        }

        /**
         * @author: ares
         * @date: 2021/3/11 21:40
         * @description: 追加数据
         */
        function refreshPrcpTable() {
            table.render({
                elem: '#table',
                data: listExtend,
                cellMinWidth: 80,
                cols: [[
                    {title: '病种', templet: '<span>{{d.disease.name}}</span>'},
                    {title: '评估量表', templet: '<span>{{d.gauge.name}}</span>'},
                    {title: '治疗人员', templet: '<span>{{d.therapist.profile_info.name}}</span>'},
                    {title: '注意事项', field: 'prescribed'},
                    {title: '操作', width: 100, templet: '#tableBar'}
                ]]
            });
            table.on('tool(table)', function (obj) {
                switch (obj.event) {
                    case 'remove':
                        removeData($(this).data('idx'));
                        break;
                }
                ;
            });
            showSubmitBtn();
        }

        /**
         * @author: ares
         * @date: 2021/3/11 21:46
         * @description: 删除数据
         * @param{number} idx
         */
        function removeData(idx) {
            listExtend.splice(idx, 1);
            refreshPrcpTable();
        }

        /**
         * @author: ares
         * @date: 2021/3/11 21:57
         * @description: 显示\隐藏提交按钮
         */
        function showSubmitBtn() {
            if (listExtend.length) {
                $createPrcp.removeClass('layui-hide');
            } else {
                $createPrcp.addClass('layui-hide');
            }
        }

        /**
         * @author: ares
         * @date: 2021/3/10 10:49
         * @description: 获取患者基本信息
         */
        function getPatientInfo() {
            commonServices.getEmrInfoService(emrId, null, null,$('.emr-info'));
        }

        /**
         * @author: ares
         * @date: 2021/3/11 20:22
         * @description: 初始化
         */
        function init() {
            getPatientInfo();
            getDisease();
            getTherapist();
        }
    })
</script>

</body>
</html>